<template>
<starGenView :title="lang.title">
  <cfg-table
    :config='config'
    :data='data'
    :columns='columns'
    :additionalAction='additionalAction'
    :pageSizeOpts='pageSizeOpts'
    :pageNavigation='pageNavigation'
    :queryFormItem='queryFormItem'
    :collapseFormItem='collapseFormItem'
    @handleCreate="handleCreate"
    @handleEdit="handleEdit"
    @handleDelete="handleDelete"
    @handleDetail="handleDetail">
    </cfg-table>
    <input v-show="false" ref="fileRef" type="file" multiple="multiple" id="files" name="files"  @change="fileChange">
    <editor v-if="drawer.show" :data="modelData"  :model-type="'entity'" :drawer="drawer" @dataSubmit="dataSubmit"></editor>
</starGenView>

</template>

<script>
import CfgTable from "public/components/table/cfgTable";
import editor from "./editor";
export default {
  name: "index",
  components: {CfgTable,editor},
  computed:{
    lang(){
      return {
        'zh-CN':{
          title:'文档管理页面',
        },
        'en-US':{
          title:'document management page'
        }
      }[this.G_Locale]
    }
  },
  data(){
    return {
        config:{
            search:true,
            addButton:true,
            batchDeleteButton:true,
            downloadIcon:false,
            uploadIcon:false,
            uploadUrl:'http://localhost:9090/star4.0/docs/uploadFile',
            tableSizeIcon:true,
            fullscreenIcon:true,
            refreshIcon:true,
            columnSettingIcon:true,
            action:true,
            additionalAction:true
        },
        data: [],
        columns:[
                {
                key: 'name',
                title: '名称',
                minWidth: 100,
                align: 'center',
                show: true
                },
                {
                key: 'code',
                title: '编码',
                minWidth: 100,
                align: 'center',
                show: true
                },
                /* {
                key: 'category',
                title: '业务分类',
                minWidth: 100,
                align: 'center',
                show: true,
                },
                {
                key: 'displayFileName',
                title: '显示文件名',
                minWidth: 100,
                align: 'center',
                show: true
                },*/
                {
                key: 'fileName',
                title: '文件名',
                minWidth: 100,
                align: 'center',
                show: true
                },
                {
                key: 'extendName',
                title: '文件扩展名',
                minWidth: 100,
                align: 'center',
                show: true
                },
                {
                key: 'filePath',
                title: '文档存储路径',
                minWidth: 100,
                align: 'center',
                show: true
                },
                {
                key: 'comments',
                title: '说明',
                minWidth: 100,
                align: 'center',
                show: true
                },
                /* {
                key: 'createBy',
                title: '创建人',
                minWidth: 100,
                align: 'center',
                show: true
                }, */
                {
                key: 'createTime',
                title: '创建时间',
                minWidth: 60,
                align: 'center',
                show: true,
                },
                /* {
                key: 'updateBy',
                title: '修改人',
                minWidth: 100,
                align: 'center',
                show: true
                }, */
                {
                key: 'updateTime',
                title: '更新时间',
                minWidth: 100,
                align: 'center',
                show: true,
                },
            ],
        additionalAction:{
                key: 'additionalAction',
                title: 'additionalAction',
                slot: 'additionalAction',
                width: 200,
                fixed:'right',
                align: 'center',
                show: true,
                buttons:[
                    //{title: '上传',color:'red', event: (row, index) => this.uploadFile(row)},
                    {title: '下载', event: (row, index) => this.downloadFile(row)}
                    ]
            },
        pageSizeOpts:[10, 30, 50, 100],
        pageNavigation: { total: 0, pageSize: 10, pageNumber: 1 },
        queryFormItem: [
                {title:'名称',key:'name',config:{type:'preText',prepend:'abc_'}},
                {title:'编码',key:'code',config:{type:'text'}},
                //{title:'业务分类',key:'category',config:{type:'text'}},
                //{title:'文件名',key:'displayFileName',config:{type:'text'}},
                {title:'文件名',key:'fileName',config:{type:'text'}},
                {title:'文档扩展名',key:'extendName',config:{type:'text'}},
                {title:'文档存储路径',key:'filePath',config:{type:'text'}},
                // {title:'abc',key:'any',config:{type:'select'}},
            ],
        collapseFormItem:[
                {title:'名称',key:'name',config:{type:'select'}},
                {title:'文件名',key:'fileName',config:{type:'select'}},
            ],
        selRow:{},
        templateRow:{
          id:"",
          name:"",
          code:"",
          category:"",
          displayFileName:"",
          fileName:"",
          extendName:"",
          filePath:"",
          comments:"",
          createBy:"",
          createTime:"",
          updateBy:"",
          updateTime:""
        },
        blobJson:{
          aac:"audio/aac",
          abw:"application/x-abiword",
          arc:"application/x-freearc",
          avi:"video/x-msvideo",
          azw:"application/vnd.amazon.ebook",
          bin:"application/octet-stream",
          bmp:"image/bmp",
          bz:"application/x-bzip",
          bz2:"application/x-bzip2",
          csh:"application/x-csh",
          css:"text/css",
          csv:"text/csv",
          doc:"application/msword",
          docx:"application/vnd.openxmlformats-officedocument.wordprocessingml.document",
          eot:"application/vnd.ms-fontobject",
          epub:"application/epub+zip",
          gif:"image/gif",
          htm:"text/html",
          html:"text/html",
          ico:"image/vnd.microsoft.icon",
          ics:"text/calendar",
          jar:"application/java-archive",
          jpeg:"image/jpeg",
          jpg:"image/jpeg",
          js:"text/javascript",
          json:"application/json",
          jsonld:"application/ld+json",
          mid:"audio/midi audio/x-midi",
          midi:"audio/midi audio/x-midi",
          mjs:"text/javascript",
          mp3:"audio/mpeg",
          mpeg:"video/mpeg",
          mpkg:"application/vnd.apple.installer+xml",
          odp:"application/vnd.oasis.opendocument.presentation",
          ods:"application/vnd.oasis.opendocument.spreadsheet",
          odt:"application/vnd.oasis.opendocument.text",
          oga:"audio/ogg",
          ogv:"video/ogg",
          ogx:"application/ogg",
          otf:"font/otf",
          png:"image/png",
          pdf:"application/pdf",
          ppt:"application/vnd.ms-powerpoint",
          pptx:"application/vnd.openxmlformats-officedocument.presentationml.presentation",
          rar:"application/x-rar-compressed",
          rtf:"application/rtf",
          sh:"application/x-sh",
          svg:"image/svg+xml",
          swf:"application/x-shockwave-flash",
          tar:"application/x-tar",
          tif:"image/tiff",
          tiff:"image/tiff",
          ttf:"font/ttf",
          txt:"text/plain",
          vsd:"application/vnd.visio",
          wav:"audio/wav",
          weba:"audio/webm",
          webm:"video/webm",
          woff:"font/woff",
          woff2:"font/woff2",
          xhtml:"application/xhtml+xml",
          xls:"application/vnd.ms-excel",
          xlsx:"application/vnd.openxmlformats-officedocument.spreadsheetml.sheet",
          xml:"text/xml",
          xul:"application/vnd.mozilla.xul+xml",
          zip:"application/zip",
          "3gp":"video/3gpp、audio/3gpp",
          "3g2":"video/3gpp2、audio/3gpp2",
          "7z":"application/x-7z-compressed",
        },
        modelData:{},
        drawer: {
          default: () => {
            return {
              show: false,
              type: 'read', // edit || read || new
            };
          }
        },
    }
  },
  created(){
    this.initDocumentData();
  },
  methods:{
    initDocumentData(){
        var query = [{condition:""}];
        this.$api.BaseDocs.query(query).then(resp => {
            this.data = resp;
        })
    },
    /* handleUpload(file){
      let formData = new FormData()
      formData.append('file',file)
      formData.append("id",'1');
      this.G_Upload(formData,(res)=>{
        this.selRow = res.data;
        this.initDocumentData();
      })
    },
    uploadFile(row){
      this.selRow =  row;
      this.$refs.fileRef.dispatchEvent(new MouseEvent('click'))  //弹出选择本地文件
    },
    fileChange(event){
      event.preventDefault();
      let formData = new FormData()
      let file = this.$refs.fileRef.files[0]
      formData.append('file',file)
      formData.append("id",this.selRow.id);
      this.$api.BaseDocs.uploadFile(formData).then(resp => {
        this.selRow = resp.data;
        this.initDocumentData();
      })
    }, */
    uploadFile(row){
      this.$refs.fileRef.dispatchEvent(new MouseEvent('click'))  //弹出选择本地文件
    },
    fileChange(event){
      event.preventDefault();
      let formData = new FormData()
      /* let files = this.$refs.fileRef.files;
      files.forEach(v => {
          formData.append('files',v,v.name);
      }); */
      let file = this.$refs.fileRef.files[0];
      let file1 = this.$refs.fileRef.files[1];
      formData.append('files',file)
      formData.append('files',file1)
      //formData.append("id",'');
      this.$api.BaseDocs.uploadFiles(formData).then(resp => {
        console.log(resp.data);
      })
    },
    downloadFile(row){
      let link = document.createElement('a')
      //link.href = row.filePath.replace('.','http://localhost:9091/star4.0')+row.fileName+'.'+row.extendName;    //url文件地址
      link.href = row.filePath.replace('.','http://110.40.138.207:9091/star4.0')+row.fileName+'.'+row.extendName;    //url文件地址
      link.download = row.fileName+'.'+row.extendName  //加上下载的文件名
      
      link.click()
      link.remove()

      /* this.$api.BaseDocs.downloadFile(row).then(data => {
        var bstr = atob(data), n = bstr.length, u8arr = new Uint8Array(n);
        while (n--) {
          u8arr[n] = bstr.charCodeAt(n);
        }
        let blob = new Blob([u8arr],{type: this.blobJson[row.extendName]});
        let fileName = row.fileName+'.'+row.extendName;
        if ('download' in document.createElement("a")) {
            const link = document.createElement("a");
            link.download = fileName;
            link.style.display = 'none';
            const url = window.URL || window.webkitURL || window.moxURL;
            link.href = url.createObjectURL(blob);
            document.body.appendChild(link);
            link.click();
            document.body.removeChild(link);  //  下载完成移除元素
            url.revokeObjectURL(link.href);  // 释放掉blob对象
        } else {
            navigator.msSaveBlob(blob, fileName);
        }
      }) */

    },
    handleCreate(){
      this.modelData=this.templateRow;
      this.$set(this.drawer, 'show', true);
      this.$set(this.drawer, 'type', 'new');
    },
    handleEdit(row,index){
      this.modelData=row;
      this.$set(this.drawer, 'show', true);
      this.$set(this.drawer, 'type', 'edit');
    },
    dataSubmit(data,type,file,fileFlag){
      let method = 'update';
      if(type=='new'){
        method = 'add';
      }
      this.$api.BaseDocs[method](data).then(resp=>{
          if(fileFlag){
            let id = resp.id;
            let formData = new FormData()
            formData.append('file',file)
            formData.append("id",id);
            this.$api.BaseDocs.uploadFile(formData).then(fileResp => {
              this.selRow = fileResp;
              this.initDocumentData();
              this.$set(this.drawer, 'show', false);
            })
          }else{
            this.selRow = resp;
            this.initDocumentData();
            this.$set(this.drawer, 'show', false);
          }

        })
    },
    handleDelete(row,index){
       this.$confirm("是否删除此节点？", "提示", {
          confirmButtonText: "确认",
          cancelButtonText: "取消",
          type: "warning",
        })
          .then(() => {

          })
          .catch(() => {});
      /* this.$Modal.confirm({
        title: '删除确认',
        content: '是否确认删除',
        onOk: () => {
          this.$api.BaseDocs.delete(row.id).then(resp=>{
            this.$api.BaseDocs.deleteFile(row).then(fileResp => {
              this.initDocumentData();
            })
          })
        },
        onCancel: () => {}
      }) */
    },
    handleDetail(row,index){
      this.modelData=row;
      this.$set(this.drawer, 'show', true);
      this.$set(this.drawer, 'type', 'read');
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
